<template>
   <h1>helloworld</h1>
   <el-button>Default</el-button>
    <el-button type="primary">Primary</el-button>
    <el-button type="success">Success</el-button>
    <el-button type="info">Info</el-button>
    <el-button type="warning">Warning</el-button>
    <el-button type="danger">Danger</el-button>

    <div>
        <Edit style="width: 1em; height: 1em; margin-right: 8px" />
        <Share style="width: 1em; height: 1em; margin-right: 8px" />
        <Delete style="width: 1em; height: 1em; margin-right: 8px" />
        <Search style="width: 1em; height: 1em; margin-right: 8px" />
    </div>

    <h1>{{count}}</h1>
    <el-button type="primary" @click="addBtn">累加</el-button>
    <el-button type="primary" @click="reduceBtn">累减</el-button>
    
</template>

<script setup lang="ts">
import { testStore } from '@/store/test/index';
import {storeToRefs} from 'pinia'

const store = testStore();

const {count } = storeToRefs(store)

const addBtn = () => {
    // store.count++
    store.setCount(++store.count)
}

const reduceBtn = () => {
    // store.count--
    store.setCount(--store.count)
}

</script>

<style scoped>

</style>
